<template>
	<view class="ConNav">
		<!-- 顶部 -->
		<view class="nav-top">
			<view>
				<text @click="gotofriend()">朋辈导航</text>
				<image
					src="http://mms1.baidu.com/it/u=341646057,650923488&fm=253&app=138&f=PNG&fmt=auto&q=75?w=292&h=292">
				</image>
			</view>
			<view>
				<text @click="gotodoctor()">专业医生</text>
				<image
					src="http://mms2.baidu.com/it/u=2567734465,646003270&fm=253&app=120&f=PNG&fmt=auto&q=75?w=200&h=200">
				</image>
			</view>
		</view>
		<!-- 小标题 -->
		<view class="small-title">
			<text>{{smallTitle}}</text>
			<view class="title-textra"></view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "ConsultNav",
		data() {
			return {
				smallTitle: this.$props.SmallTitle
			};
		},
		props: ['SmallTitle'],
		methods: {
			gotodoctor() {
				uni.navigateBack()
			},
			gotofriend() {
				uni.navigateTo({
					url: '/pages/Friend/Friend'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.ConNav {
		width: 100%;
		height: 100%;

		.nav-top {
			width: 100%;
			height: 80%;
			// sbackground-color: aqua;
			display: flex;

			view {
				width: 50%;
				display: flex;
				align-items: center;
				justify-content: center;

				&:first-child {
					border-right: 1px solid #ccc;
				}

				text {
					font-size: 40rpx;
					width: 180rpx;
				}

				image {
					width: 100rpx;
					height: 100rpx;
				}
			}
		}

		// 
		.small-title {
			width: 400rpx;
			font-size: 30rpx;

			view {
				width: 125rpx;
				height: 20rpx;
				border-radius: 15rpx;
				background-color: #4095e5;
			}
		}
	}
</style>
